﻿/*******************全局样式global-start*******************/
.section-title {
	color:#888;
	border-bottom:1px solid #ccc;
}
hr{
	border-top:1px solid #ddd;
}
/*******************全局样式global-end*******************/

/*******************布局样式layout-start*******************/
/* 提供固定布局:header、footer、wrapper和控件:titlebar、tabbar、menubar */
/*头部栏*/
.titlebar{
	background-color:#3779d0;
}
.titlebar h1{
	color: #fff;
}
.titlebar a{
	color:#fff;
}
.titlebar a:active{
	color:rgba(0,0,0,.3);
}

/*页签菜单栏*/
.tabbar{
	background-color:#f2f2f2;
	border-bottom: 1px solid #f2f2f2;
}
.tab{
	color: #454545;
}
.tab:active,.tab.active{
	color: #3779d0;
	border-bottom:2px solid #3779d0;
}
.tabbar-slider{
	background-color:#f2f2f2;
}
.tab-more{
	color:#aaa;
	background-color:#f2f2f2;
}

/*底部菜单栏*/
.menubar{
	background-color:#3779d0;
}
.menubar .menu{
	color:rgba(255,255,255,.6);
}
.menubar .menu:active,.menubar .menu.active{
	color:#fff;
}

/*标题*/
p.title{
	color:#d1d2d7;
}

/*九宫控件*/

/*九宫控件-单元格*/
.grid-cell{
	color:#aaa;
}
/*九宫控件-图片*/
.grid-img{
	background-color:#3779d0;
}
.grid-img .iconfont{
	color:#fff;
}

.grid-img .tip,.grid-thumbnail .tip{
	color:#fff;
	background-color:#e63016;
}

/*矩形框*/
.card{
	border:1px solid #dddddd;
}
/*******************布局样式layout-end*******************/

/*******************表单元素form-start*******************/
input[type="text"],
input[type="password"],
input[type="email"],
input[type="url"],
input[type="number"],
input[type="week"],
input[type="month"],
input[type="time"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="search"],
input[type="file"],
input[type="color"],
select{
	border: 1px solid #ddd;
}
textarea{
	border:1px solid #ddd;
}
input[type="checkbox"]:after,input[type="radio"]:after{
	color:#aaa;
}
/*自定义表单元素*/

/*开关控件toggle-默认风格*/
/*关闭状态*/
.toggle {
	 border:1px solid #ddd;
}
/*关闭状态圆点*/
.toggle .toggle-handle{
	 background-color:#ddd;
}
/*关闭状态文字off*/
.toggle:after{
	color: #aaa;
}

/*打开状态小圆点*/
.toggle.active .toggle-handle{
	background-color: #3779d0;
}
/*打开状态文字on*/
.toggle.active:after{
	color: #aaa;
}


/*开关控件toggle-经典风格*/
.classic.toggle{
	background-color:#ddd;
}
.classic.toggle .toggle-handle{
	background-color:#fff;
}
.classic.toggle:after{
	color:#aaa;
}

.classic.toggle.active{
	background-color:#3779d0;
}
.classic.toggle.active .toggle-handle{
	background-color:#fff;
}
.classic.toggle.active:after{
	color:#fff;
}

/*开关控件toggle-ios风格*/
.ios.toggle {
	border:1px solid #ddd;
	background-color:#fff;
}
.ios.toggle .toggle-handle {
	background-color:#fff;
	border:1px solid #ddd;
}

.ios.toggle.active {
	border-color:#3779d0;
	background-color:#3779d0;
}
.ios.toggle.active:after{
	color:#fff;
}
.ios.toggle.active .toggle-handle {
	border-color:#3779d0;
}
[data-role="select"]{
	position:relative;
	z-index:20;
}
[data-role="select"] select{
	width:100%;
	position:absolute;
	color:#aaa;
	background-color:transparent;
	z-index:20;
}
[data-role="file"]:active,
[data-role="date"]:active,
[data-role="time"]:active,
[data-role="barcode"]:active,
[data-role="qrcode"]:active,
[data-role="checkbox"]:active,
[data-role="radio"]:active
{
	background-color:#eee;
}

[data-role="select"]:after,
[data-role="file"]:after,
[data-role*="file-"]:after,
[data-role="date"]:after,
[data-role="time"]:after,
[data-role="barcode"]:after,
[data-role="qrcode"]:after,
[data-role="checkbox"] input[type="checkbox"],
[data-role="radio"] input[type="radio"]{
	color: #aaa;
}
/*******************表单元素form-end*******************/


/*******************表单布局formlayout-start*******************/
.form-common .label-left,.form-common .label-right{
	background-color:#fff;
}
.form-common .label-left{
	color:#000;
}

/*矩形表单*/
.form-square .label-left{
	color:#454545;
	border-color:#ddd;
}
.form-square .label-right{
	border-color:#ddd;
}

/*******************表单布局formlayout-end*******************/


/*******************按钮button-start*******************/
/*按钮-普通按钮*/
button,input[type="button"],a.button{
	color: #fff;
	background-color:#3779d0;
}
button.outline,input[type="button"].outline,a.button.outline{
	color:#3779d0;
	border:1px solid #3779d0;
}
button:active,input[type="button"]:active,a.button:active{
	color:#fff;
	border-color:#295b9d;
	background-color:#295b9d;
}

/*按钮-禁用按钮*/
button.disable,input[type="button"].disable,a.button.disable{
	background-color:#d9d9d9;
}

button.disable.outline,input[type="button"].disable.outline,a.button.disable.outline{
	color:#d9d9d9;
	border-color:#d9d9d9;
}

/*按钮-取消按钮*/
button.cancel,input[type="button"].cancel,a.button.cancel{
	background-color:#dd524d;
}

button.cancel.outline,input[type="button"].cancel.outline,a.button.cancel.outline{
	color:#dd524d;
	border-color:#dd524d;
}

button.cancel:active,input[type="button"].cancel:active,a.button.cancel:active{
	color:#fff;
	border-color:#a63e3a;
	background-color:#a63e3a;
}


/*按钮-提交按钮*/
button.submit,input[type="submit"],a.button.submit{
	background-color:#88d038;
}

button.submit.outline,input[type="submit"].outline,a.button.submit.outline{
	color:#88d038;
	border-color:#88d038;
}

button.submit:active,input[type="submit"]:active,a.button.submit:active{
	color:#fff;
	border-color:#669d2a;
	background-color:#669d2a;
}
/*按钮-链接*/
button.link,input[type="button"].link,a.button.link{
	color:#3779d0;
}
button.link.outline,input[type="button"].link.outline,a.button.link.outline{
	border:1px solid #3779d0;
	color:#3779d0;
}
button.link:active,input[type="button"].link:active,a.button.link:active{
	color:#295b9d;
	border-color:#295b9d;
}
/*按钮-气泡*/
button .tip,input[type="button"] .tip,a.button .tip{
	color:#fff;
	background-color: rgba(0, 0, 0, .15);
}
button.outline .tip,input[type="button"].outline .tip,a.button.outline .tip{
	background-color:#e73920;
}

/*******************按钮button-end*******************/

/*******************列表样式list-start*******************/
/*列表样式*/
.listitem{
	background-color:#fff;
}
.listitem li{
	border-bottom: 1px solid #ddd;
}
.listitem li:active,.listitem li.active{
	background-color:#eee;
}
.listitem li small{
	color:#aaa;
}
.listitem li .iconfont{
	color:#aaa;
}

/*列表样式-左侧图标*/
.listitem li .icon , .listitem li .ricon{
    color:#aaa;
}
.listitem li button.ricon{
	color:#fff;
}
/*列表样式-方块图标*/
.square{
	background-color:#3779d0;
}
.square .square-icon,.square i.iconfont,.square img{
	color:#fff;
}
.square .tip{
	color:#fff;
	background-color:#e63016;
}
/*列表样式-右侧文字*/
.listitem li.sliver{
	color:#aaa;
	background-color:#f6f6f6;
}
.listitem li.title{
	color:#888;
}
/***********列表样式list-end**********/


